<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

<title>MooInline Demonstration</title>	
<link  href="style.css"  rel="stylesheet" type="text/css" />
<link  href="layout.css" rel="stylesheet" type="text/css" />

<link  href="mooinline/mooinline.css" rel="stylesheet" type="text/css" />
<script src="mooinline/mootools.121C.edge.js" type="text/javascript" ></script>
<script src="mooinline/mootools-1.2-more.js" type="text/javascript" ></script>
<script src="mooinline/mooinline.js" type="text/javascript" ></script>
<script type="text/javascript">
	window.addEvent('domready', function(){ 
		var mte = new MooInline('#col1 blockquote, textarea', {location:'pageTop'}); 
		var mte2 = new MooInline('[id=editMe]', {location:'inline'}); //
		//var mte2 = new MooInline('body', {location:'pageBottom'}); 
	})
	
</script>
</head>

<body>

	<div id="header"> <h1>MooInline demonstration</h1> </div>

	<div class="container">
		<ul id="nav">
			<li><a href="#">Home</a></li>
			<li><a class="active" href="#">Demo</a></li>
			<li><a href="#">Products</a></li>
			<li><a href="#">Services</a></li>
			<li><a href="#">Order</a></li>
		</ul>
	</div>

	<div id="gutter"></div>

	<div id="col1" style="background-color:white">

		<h2>Welcome to <span style="font-weight: bold; color:#4A82BA;">Business</span> Template</h2>

		<blockquote>This template has been tested in Mozilla and IE7. The page validates as XHTML 1.0 Transitional using valid CSS. The images used in this template are courtesy of <a href="http://www.sxc.hu/" title="free images">stock xchng</a>. <br /> For more FREE templates visit <a href="http://www.mitchinson.net" title="my website" >my website</a>.</blockquote> 
		<p>The editable sections on this page wLorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed a urna ut nunc varius vulputate. Duis quis risus. Proin mollis tellus sit amet odio. Donec mauris. Suspendisse cursus lobortis magna. Vivamus vel diam ac mauris viverra dictum. Suspendisse in metus ut felis euismod pulvinar. Curabitur eu metus. Aliquam placerat, eros quis consectetuer vulputate, est nibh cursus lacus, fermentum vestibulum enim diam quis diam. Vivamus ornare viverra leo. Phasellus eget enim vel elit mollis fermentum.</p>
		

		<p id="editMe"><img class="imgleft" src="images/image.jpg" alt="" />This is a <a href="#">LINK</a> to nowhere. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed a urna ut nunc varius vulputate. Duis quis risus. Proin mollis tellus sit amet odio. Donec mauris. Suspendisse cursus lobortis magna. Vivamus vel diam ac mauris viverra dictum. Suspendisse in metus ut felis euismod pulvinar. Curabitur eu metus. Aliquam placerat, eros quis consectetuer vulputate, est nibh cursus lacus, fermentum vestibulum enim diam quis.</p> 
	</div>
	
	<div id="col2">

		<h2>About Our Company</h2>

		<p><span style="color: #CE565F; font-size: 1.4em;">Lorem ipsum dolor sit amet,  </span></p>
		<p>Aliquam placerat, eros quis consectetuer vulputate, est nibh cursus lacus, fermentum vestibulum enim diam quis diam. This is a <a href="#">LINK</a> to nowhere. </p>

		<h2>Contact Us</h2>

		<p class="post"><span class="date">This goes nowhere</span></p>

		<p><input type="text" value="name"/></p>
		<p><input type="text" value="email"/></p>
		<p><textarea style="height:200px;"> Please enter your comments here</textarea></p>
		<p class="post">					
			<a href="index.html" class="readmore">Read more</a>
			<a href="index.html" class="comments">Comments (3)</a>
		</p>
	</div>

	<div id="col3">

		<form action="" method="post">
			<fieldset>
			<legend>SEARCH</legend>
			<div>
			<span><label for="txtsearch"><img src="images/search.gif" alt="search" /> </label></span>
			<span><input type="text" value="demo only" name="txtsearch" title="Text input: search" id="txtsearch" size="25" /></span>
			</div>
			</fieldset>
		</form>

		<h2>Resources</h2>

		<div id="navcontainer">

			<ul id="navlist">
				<li><a href="http://www.siteroller.org"    title="MooTextarea Home">SiteRoller</a></li>
				<li><a href="http://www.mitchinson.net"    title="my website">Snapp Happy</a></li>
				<li><a href="http://www.openwebdesign.org" title="The Open Design Community">TODC</a></li>
				<li><a href="http://andreasviklund.com">Andreas Viklund</a></li>
				<li><a href="http://www.jameskoster.co.uk">James Koster</a>  </li>
				<li><a href="http://www.oswd.org">OSWD</a></li>
				<li><a href="http://www.cssplay.co.uk"> CSS Play </a></li>
				<li><a href="http://css.maxdesign.com.au/listamatic" title="CSS menus">Listamatic </a></li>	
				<li><a href="http://www.mandarindesign.com"title="CSS/HTML code- copy and paste style">Mandarin Design</a></li>
				<li><a href="http://www.alistapart.com"    title="a special focus on web standards and best practices">A List Apart</a></li>
				<li><a href="http://www.positioniseverything.net" title="explains some obtuse CSS bugs in modern browsers">Position Is Everything</a></li>
				<li><a href="http://www.accessify.com"     title="articles and tutorials on Web Accessibility for the conscientious web developer">Accessify</a></li>
			</ul> 
			
		</div>
		<div class="info">
			<h2>Information</h2>

			<p><a href="#"><span style="font-size: 1.4em;">Our Products</span></a></p>
			<p><a href="#"><span style="font-size: 1.4em;">Our Services</span></a></p>
			<p><a href="#"><span style="font-size: 1.4em;">How To Order</span></a></p>
		</div>
	</div>

	<div id="footer">
		<a href="#">homepage</a> | <a href="mailto:denise@mitchinson.net">contact</a> | <a href="http://validator.w3.org/check?uri=referer">html</a> | <a href="http://jigsaw.w3.org/css-validator">css</a> |  &copy; 2007 Anyone | Design by <a href="http://www.mitchinson.net"> www.mitchinson.net</a> |  This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attribution 3.0  License</a>
	</div>
	
</body>
</html>
<!-- 
<div><script type="text/javascript">/*alert("hello");*/ </script></div>, .info,#footer, [method=post], #col1, , #navcontainer' 
<div><div id="joe">Joe</div><div>
<div><script type="text/javascript">var mte = new MooTextarea('#col1 blockquote, textarea'); </script></div> , .info,#footer, [method=post], #col1, , #navcontainer'

-->